<script setup>
import { ref } from 'vue'
//引入子组件
import CustomNavbar from './components/CustomNavbar/index.vue'
import XtxSwiper from '@/components/XtxSwiper/index.vue'
import CategoryPanel from './components/CategoryPanel/index.vue'
import HotPanel from './components/HotPanel/index.vue'
import XtxGuess from '@/components/XtxGuess/index.vue'
//引入store

//滚动到底部加载更多
const guessRef = ref(null)
const onScrolltolower = async () => {
  guessRef.value.getMore()
}
//上拉刷新
const isTriggered = ref(false)
const onRefresherrefresh = async () => {
  isTriggered.value = true
  await guessRef.value.resetData()
  await guessRef.value.getMore()
  isTriggered.value = false
}
</script>
<template>
  <scroll-view
    scroll-y
    @scrolltolower="onScrolltolower"
    style="height: 100vh"
    refresher-enabled
    @refresherrefresh="onRefresherrefresh"
    :refresher-triggered="isTriggered"
  >
    <CustomNavbar />
    <XtxSwiper :distributionSite="1" />
    <CategoryPanel />
    <HotPanel />
    <view class="like">猜你喜欢</view>
    <XtxGuess ref="guessRef" />
  </scroll-view>
</template>
<style>
.like {
  text-align: center;
  font-size: 28px;
}
</style>
